import React, {Component} from 'react'
import { Table } from 'antd'
import {connect} from 'dva'
import PropTypes from 'prop-types'

@connect(s => ({
  ...s['commonTable'],
  tableLoading: s.loading.models['commonTable']
}))
class Comp extends Component{
  static propTypes = {
    columns: PropTypes.array,
    dataSource: PropTypes.array,
    pagination: PropTypes.oneOfType([
      PropTypes.bool, PropTypes.object
    ])
  }
  componentDidMount() {
    const {url, dispatch} = this.props
    url&&dispatch({
      type: 'commonTable/getTableList',
      url
    })
  }

  // 表格底部分页被点击
  onPageChange = (page) => {
    this.props.dispatch({
      type: 'commonTable/onPageChange',
      page,
    })
  }

  onShowSizeChange=(current, size) => {
    this.props.dispatch({
      type: 'commonTable/onShowSizeChange',
      size,
    })
  }

  render() {
    const {pagination, tableRecords, tablePage, tableSize,  tableTotal, dispatch, tableLoading, ...props} = this.props
    let page = null
    if (pagination === false) {
      page = false
    } else {
      page= {
        current: tablePage,
        total: tableTotal,
        showTotal: v => `共${v}条`,
        showQuickJumper: true,
        showSizeChanger: true,
        pageSize: tableSize,
        onChange: this.onPageChange,
        onShowSizeChange: this.onShowSizeChange,
        ...pagination
      }
    }
    return (
      <Table
        size={'small'}
        loading={tableLoading}
        rowKey={'id'}
        dataSource={tableRecords}
        pagination={page}
        {...props}
      />
    )
  }
}
export default Comp
